<div class="predefined_section row page_section" id="{{page_section}}" >
    <div class="predefined_section_head col-md-12">
        <div class="section_name">
            Predefined Section
        </div>
        <div class="edit_block">
            <!-- <span class="clone_section"><i class="fa-regular fa-copy"></i></span> -->
            <span class="section-settings pull-right cursor-pointer">
                <i class="fa-solid fa-gear"></i>
            </span>
           <!--  <span class="" id="" data-toggle="collapse" data-target="#{{page_section}}">
                <i class="fa-solid fa-chevron-down"></i>
               </span> -->
           <span class="delete_section">
            <i class="fa-regular fa-trash-can"></i>
           </span>
        </div>
    </div>
<div class="col-md-12 template_grid"  data-id="0" data-parent-idx="0" data-ele-id="" data-cid="0">
	<div class="section_name" style="
    float: left;
    margin-right: 15px;
">
           {{title}}
        </div>
        <div style="float:left">
      <div class="edit_predifined_block" style="
    float: left;
    /* border: 1px solid #42a3b9; */
    background-color: var(--primary);
    color: var(--white);
    white-space: nowrap;
    --icon-stroke: currentColor;
    --icon-fill-bg:
    var(--primary);
    padding: 5px 10px;
    margin-top: -5px;cursor: pointer;
"><i class="fa-regular fa-pen-to-square"></i> Edit Data</div> 
</div>
</div>
  </div>